// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Upload dropzone component correctly overrides description and drop messages 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        <span>
          Test %{linkStart}description%{linkEnd} message.
        </span>
      </p>
    </div>
  </button>
  <input
    accept="image/jpg,image/jpeg"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style="display: none;"
    >
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Test drop-to-start message.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when dragging renders correct template when drag event contains files 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        Drop or
        <gl-link-stub>
          upload
        </gl-link-stub>
        files to attach
      </p>
    </div>
  </button>
  <input
    accept="image/*"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style=""
    >
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when dragging renders correct template when drag event contains files and text 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        Drop or
        <gl-link-stub>
          upload
        </gl-link-stub>
        files to attach
      </p>
    </div>
  </button>
  <input
    accept="image/*"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style=""
    >
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when dragging renders correct template when drag event contains text 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        Drop or
        <gl-link-stub>
          upload
        </gl-link-stub>
        files to attach
      </p>
    </div>
  </button>
  <input
    accept="image/*"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style=""
    >
      <div
        class="gl-text-center mw-50"
        style=""
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when dragging renders correct template when drag event is empty 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        Drop or
        <gl-link-stub>
          upload
        </gl-link-stub>
        files to attach
      </p>
    </div>
  </button>
  <input
    accept="image/*"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style=""
    >
      <div
        class="gl-text-center mw-50"
        style=""
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when dragging renders correct template when dragging stops 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        Drop or
        <gl-link-stub>
          upload
        </gl-link-stub>
        files to attach
      </p>
    </div>
  </button>
  <input
    accept="image/*"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style="display: none;"
    >
      <div
        class="gl-text-center mw-50"
        style=""
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when no slot provided renders default dropzone card 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <button
    class="card gl-align-items-center gl-h-full gl-justify-content-center gl-mb-0 gl-px-5 gl-py-4 gl-w-full upload-dropzone-border upload-dropzone-card"
    type="button"
  >
    <div
      class="gl-align-items-center gl-display-flex gl-flex-direction-column gl-justify-content-center gl-text-center"
      data-testid="dropzone-area"
    >
      <gl-icon-stub
        class="gl-mb-2"
        name="upload"
        size="24"
      />
      <p
        class="gl-mb-0"
        data-testid="upload-text"
      >
        Drop or
        <gl-link-stub>
          upload
        </gl-link-stub>
        files to attach
      </p>
    </div>
  </button>
  <input
    accept="image/*"
    class="hide"
    multiple=""
    name="upload_file"
    type="file"
  />
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style="display: none;"
    >
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;

exports[`Upload dropzone component when slot provided renders dropzone with slot content 1`] = `
<div
  class="gl-relative gl-w-full"
>
  <div>
    dropzone slot
  </div>
  <transition-stub
    name="upload-dropzone-fade"
  >
    <div
      class="card gl-absolute gl-align-items-center gl-display-flex gl-h-full gl-justify-content-center gl-p-4 gl-w-full upload-dropzone-border upload-dropzone-overlay"
      style="display: none;"
    >
      <div
        class="gl-text-center mw-50"
        style="display: none;"
      >
        <h3>
          Oh no!
        </h3>
        <span>
          You are trying to upload something other than an image. Please upload a .png, .jpg, .jpeg, .gif, .bmp, .tiff or .ico.
        </span>
      </div>
      <div
        class="gl-text-center mw-50"
      >
        <h3>
          Incoming!
        </h3>
        <span>
          Drop your files to start your upload.
        </span>
      </div>
    </div>
  </transition-stub>
</div>
`;
